<template>
<div>
  <div class="login">
    <el-input v-model.trim="input.number" style="width:30% ; text-align:center;" placeholder="请输入您的考号" :disabled="show"/>
    <el-button type="primary" style="text-align:center;" @click="handleVerify(input.number)" v-if="!show" >开始抽题</el-button>
    <el-button type="primary" style="text-align:center;" plain disabled v-show="show">开始抽题</el-button>
  </div>
</div>
</template>

<script>
import { createVerify} from '@/api/verify'
export default {

  data() {
    return {
      input: {
        number: ''
      },
      show:false,
      topic:[],
    }
  },
  created(){
    this.$store.commit("setShow",false)
  },
  methods: {
    handleVerify(number) {
      if (number === '') {
        this.$message({
          message: '请先输入考号',
          type: 'warning'
        })
      } else {
        createVerify(number).then(res => {
          console.log(res)
        if (res.isExist === false) {
            this.$store.commit('settopic', res.data)
            this.$router.push({ name: 'Subject', params: { id: this.input.number }})
          } else{
            this.$store.commit('setSelect', res.data.topic)
            this.$router.push({ name: 'correct', params: { id: this.input.number }})
          }
        }).catch(() => {
          console.log("没进上面那个方法")
        })
      }
    },
  }
}
</script>

<style lang="scss" scoped>
.login{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30%;
  margin-top: 15%;
}
.subject{
  height: 70%;
  width: 70%;
  margin: auto;
  margin-top: 100px;
}
</style>
